<template>
    <Modal v-model:visible="isShowModal" :title="`${isCopy ? '复制模型' : '模型管理'}`" @ok="handleOk" ok-text="提交"
        cancel-text="取消" :closable="false" :loading="loading" :width="500">
        <Form :model="formState" :label-col="{ span: 4 }" :wrapper-col="{ span: 20 }">
            <FormItem label="模板名称">
                <Input v-model:value="formState.name" placeholder="请输入模板名称" allowClear></Input>
            </FormItem>
            <FormItem label="适用职位">

                <TreeSelect v-model:value="formState.jobTypeIds" style="width: 200px; max-height: 84px;"
                    placeholder="请选择使用职位" :tree-data="modelOption"
                    :fieldNames="{ children: 'children', label: 'name', value: 'id' }" multiple
                    class="!w-full overflow-y-scroll" tree-checkable>
                </TreeSelect>
            </FormItem>
            <FormItem label="模板权重">
                <Input v-model:value="formState.weight" placeholder="请输入模板权重" allowClear></Input>
            </FormItem>
        </Form>
    </Modal>
</template>

<script lang="ts" setup>
import { ref, watch } from 'vue';
import { Modal, Form, Input, message, TreeSelect } from 'ant-design-vue';
import { KnowledgeTemplateEditRequest, KnowledgeTemplateApi, KnowledgeTemplateResult, JobType } from '@/api';

const FormItem = Form.Item;

const emit = defineEmits(['ok']);
const props = defineProps<{ position?: JobType[] }>()

const isShowModal = ref(false)
const loading = ref(false)
const modelOption = ref<JobType[]>(props.position || [])
const editId = ref()
let formParams = {
    name: '',
    weight: 0,
}
const formState = ref<KnowledgeTemplateEditRequest>(JSON.parse(JSON.stringify(formParams)))
const isCopy = ref(false)

watch(() => props.position,
    val => {
        modelOption.value = val || [];
    })

const handleOpen = (data: KnowledgeTemplateResult, copy: boolean = false) => {
    console.log(copy);
    isCopy.value = copy;
    editId.value = data?.id?.toString();

    if (data) {
        formState.value = {
            jobTypeIds: data.jobTypeIds || undefined,
            name: data.name,
            weight: data.weight,
        };
    } else {
        handleEmpty();
    }
    isShowModal.value = true;
}

const handleOk = async () => {
    loading.value = true;
    try {
        if (isCopy.value) {
            await KnowledgeTemplateApi.knowledgetemplateCopy(editId.value, formState.value)
            message.success('复制成功')
        } else {
            if (editId.value) {
                await KnowledgeTemplateApi.knowledgetemplateEdit(editId.value, formState.value)
                message.success('编辑成功')
            } else {
                await KnowledgeTemplateApi.knowledgetemplateAdd(formState.value)
                message.success('添加成功')
            }
        }
        emit('ok')
        handleClose();
    } catch (error) {

    } finally {
        loading.value = false;
    }
}

const handleEmpty = () => {
    formState.value = JSON.parse(JSON.stringify(formParams));
}

function handleClose() {
    isShowModal.value = false;
}

defineExpose({ handleOpen })
</script>